<template>
	<view class="main">
		<view class="tips">
			灵活用工平台严厉打击违法违规类信息发布如您发现对方存在违法违规行为请反馈给我们.
		</view>
		<view class="userinfo">
			<view class="title">举报对象</view>
			<view class="user">
				<view class="cont">
					<image src="../../static/image/ico/jyxx.png" mode="" class="avatar"></image>
					<view class="name">张小萌</view>
				</view>
				<u-icon name="arrow-right" color="#C7C7C7" size="28"></u-icon>
			</view>
		</view>
		<view class="report">
			<view class="title">举报类型</view>
			<view class="cont">
				<u-radio-group v-model="report" :wrap="true">
					<u-radio name="存在欺骗/欺诈行为">
						存在欺骗/欺诈行为
					</u-radio>
					<u-radio name="个人主页信息侵权">
						个人主页信息侵权
					</u-radio>
					<u-radio name="其他">
						其他
					</u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="detail">
			<view class="title">详情描述</view>
			<view class="cont">
				<u-input 
				v-model="detail" 
				type="textarea"
				:auto-height="false"
				placeholder="请如实填写举报内容,以便工作人员取证查实" />
			</view>
		</view>
		<button type="default" class="submit">提交</button>
	</view>
</template>

<script>
	export default {
		components:{
			
		},
		data() {
			return {
				report:'',
				detail:''
			}
		},
		onLoad() {
			
		},
		onShow() {
			
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.main{
		min-height: 100vh;
		background-color: #f9f9f9;
		.tips{
			padding: 33rpx 30rpx 30rpx 30rpx;
			background-color: #ffffff;
			font-size: 28rpx;
			font-weight: 400;
			color: #4A90E2;
			line-height: 40rpx;
			border-bottom: 1px solid #E6E6E6;
		}
		.title{
			font-size: 28rpx;
			font-weight: 500;
			color: #333333;
			line-height: 40rpx;
		}
		.userinfo{
			background-color: #FFFFFF;
			padding: 28rpx 30rpx 30rpx 30rpx;
			.user{
				display: flex;
				justify-content: space-between;
				align-items: center;
				.cont{
					display: flex;
					align-items: center;
					margin-top: 30rpx;
					.avatar{
						width: 95rpx;
						height: 95rpx;
						border-radius: 50rpx;
					}
					.name{
						margin-left: 30rpx;
						font-size: 32rpx;
						font-weight: 400;
						color: #333333;
						line-height: 32rpx;
					}
				}
			}
		}
		.report{
			padding: 30rpx;
			.cont{
				margin-top: 30rpx;
				padding: 0 20rpx;
				background: #FFFFFF;
				border-radius: 8rpx;
				/deep/.u-radio{
					padding: 25rpx 0;
					border-bottom: 1px solid #E6E6E6;
				}
				/deep/.u-radio:last-child{
					border-bottom: 0;
				}
			}
		}
		.detail{
			padding: 0 30rpx;
			.cont{
				padding: 24rpx 20rpx;
				background: #FFFFFF;
				border-radius: 8rpx;
				margin: 30rpx 0;
				/deep/uni-textarea{
					height: 129rpx;
				}
			}
		}
		.submit{
			width: 690rpx;
			height: 100rpx;
			background: #4A90E2;
			border-radius: 50rpx;
			font-size: 34rpx;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 100rpx;
			&::after{
				border: 0;
			}
		}
	}
	
</style>
